<template>
  <div>
    <Button
      type="error"
      style="margin-left:10px;margin-bottom:10px"
      :disabled="twobtn"
      @click="OpendelBtn"
    >删除</Button>
    <!-- <Button style="margin-left:10px;margin-bottom:10px" :disabled="twobtn" @click="cancelBtn">取消选择</Button> -->
    <Table
      border
      ref="selection"
      :columns="modalColumns"
      :data="data1"
      @on-select="ListSelect"
      @on-select-cancel="ListSelect"
    ></Table>
    <Page :total="rows" :page-size="10" @on-change="NextPage" />
    <Modal v-model="modal2" width="360" :mask-closable="true" @on-cancel="cancelBtn">
      <p slot="header" style="color:#000;text-align:center">
        <span></span>
      </p>
      <p style="margin-bottom:10px">真的要删除吗？</p>

      <div slot="footer">
        <Button @click="cancelBtn">取消</Button>
        <Button type="primary" @click="delBtn">确定</Button>
      </div>
    </Modal>
  </div>
</template>

<script>
import Util from "../../libs/util";
export default {
  data() {
    return {
      data1: [],
      modal2: false,
      twobtn: true,
      PageIndex: 1,
      rows: 0,
      selectIds: [],
      wid: -1,
      modalColumns: [
        {
          title: "选择",
          key: "wid",
          width: 70,
          align: "center",
          type: "selection"
        },
        { title: "微信用户昵称", key: "nickname" },
        { title: "内容", key: "content" },
        { title: "提问时间", key: "create_time" }
      ]
    };
  },
  created() {
    var _this = this;
    _this.getList();
  },
  methods: {
    NextPage(index) {
      var _this = this;
      _this.PageIndex = index;
      _this.getList();
    },
    //ListSelect
    ListSelect(data) {
      var _this = this;
      if (data.length == 0) {
        _this.twobtn = true;
        return;
      } else {
        _this.twobtn = false;
        _this.selectIds = [];
        for (let k of data) {
          _this.selectIds.push(k.id);
        }
      }
    },
    //获取列表
    OpendelBtn() {
      var _this = this;
      _this.modal2 = true;
    },
    getList() {
      var _this = this;
      var data = {
        page: _this.PageIndex,
        size: 10
      };
      var params = {
        url: "/contact/list",
        type: Util.method.post,
        data: data,
        success: _successFun,
        error: _errorFun
      };
      Util.ajax(_this, params, true);
      function _successFun(res) {
        if (res.result == 0) {
          console.log(res);
          _this.data1 = res.data;
          _this.rows = res.rows;
        }
      }

      function _errorFun(err) {
        _this.$Message.destroy();
        _this.$Message.error("服务器内部错误，暂时无法使用!");
      }
    },
    //删除
    delBtn() {
      var _this = this;

      var data = {
        ids: _this.selectIds
      };
      var params = {
        url: "/contact/del",
        type: Util.method.post,
        data: data,
        success: _successFun,
        error: _errorFun
      };
      Util.ajax(_this, params, true);
      function _successFun(res) {
        if (res.result == 0) {
          console.log(res);
          _this.$Message.success("删除成功");
          _this.modal2 = false;
          _this.twobtn = true;
          _this.getList();
        }
      }

      function _errorFun(err) {
        _this.$Message.destroy();
        _this.$Message.error("服务器内部错误，暂时无法使用!");
      }
    },
    //取消按钮
    cancelBtn() {
      var _this = this;
      _this.modal2 = false;
    }
  }
};
</script>

<style>
</style>